{% extends "main/base/base.html" %}
{% block header %}
    <title>{{ article.title }}</title>
    <meta name="description" content="{{ article.description }}">
    <meta name="keywords" content="{{ article.keywords }}">
{% endblock %}
{% block sking %}
    <!-- markdown -->
    <link rel="stylesheet" href="{{ url_for("static",filename="lib/edit.markdown/css/editormd.css") }}">
    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="{{ url_for("static",filename="main/article/article.css") }}">
    <style>
        .editormd-html-preview {
            padding: 0px;
        }
    </style>
{% endblock %}
{% block nav %}
    <div class="" style="background: #ffffff;padding-top: 50px;margin-bottom: 15px">
        <div class="container">
            <ol class="breadcrumb">
                <li><a href="/">首页</a></li>
                <li>
                    <a href="{{ url_for("main.article_lists",name=article.category_id|getCategory) }}">{{ article.category_id|getCategory }}</a>
                </li>
                <li><a href="" class="active">{{ article.title }}</a></li>
            </ol>
        </div>
    </div>
{% endblock %}
{% block main %}
    <div class="col-xs-12 col-md-8" style="background: #fff;padding-bottom: 15px">
        <div style="padding: 30px 10px">
            <div class="page-header">
                <h3>{{ article.title }}</h3>
                <span style="color: #0a6999"><a
                        href="{{ url_for('main.article_lists',name=article.category_id|getCategory) }}">{{ article.category_id|getCategory }}</a>
                </span> |
                <span style="color: #0a6999">{{ article.user_id|getUser }}</span>
                | <span>{{ article.create_time }}</span> |
                <span>共有<strong class="text-success">{{ article.count }}</strong>关注了这篇文章</span>
            </div>
            <div class="content" style="word-wrap: break-word;">
                {% if not article.markdown or article.markdown is none %}
                    {{ article.content|safe }}
                {% else %}
                    <div id="test-editormd-view">
                        <textarea style="display:none;">{{ article.markdown }}</textarea>
                    </div>
                {% endif %}
                {% if article.relationship %}
                    <hr>
                    {{ article.relationship|safe }}
                {% endif %}
                <hr>
                本文链接:<a
                    href="http://blog.motkit.com{{ url_for("main.article_details",id=article.id) }}">{{ article.title }}</a>
            </div>
            <hr>
{#            <div class="">#}
{#                <form method="post" id="form_data" class="form form-horizontal">#}
{#                    <label for="input_info">评论：</label>#}
{#                    {% for error in form.content.errors %}#}
{#                        <span style="color: red">{{ error }}</span>#}
{#                    {% endfor %}#}
{#                    {{ form.content }}#}
{#                    <input type="hidden" name="user_id" value="">#}
{#                    <input type="hidden" name="pid" value="">#}
{#                    <input type="hidden" name="article_id" value="{{ article.id }}">#}
{#                    <div style="padding-top: 8px">#}
{#                        {{ form.csrf_token }}#}
{#                        {{ form.submit }}#}
{#                    </div>#}
{#                </form>#}
{#            </div>#}
{#            <hr>#}
{#            <div>#}
{#                <div>#}
{#                    <div class="pull-left">评论</div>#}
{#                    <div class="pull-right">共有{{ article.Reply.filter_by(is_show=1).count() }}条评论</div>#}
{#                </div>#}
{#                <div style="clear: both;height: 15px"></div>#}
{#                {% for vo in comments %}#}
{#                    <div class="media" style="padding: 15px;background: #fff;">#}
{#                        {% if vo.user_id %}#}
{#                            <div class="media-left media-middle">#}
                                {#                                <img class="media-object img-responsive"#}
                                {#                                     src="#"#}
                                {#                                     alt="占位">#}
{#                            </div>#}
{#                        {% endif %}#}
{#                        <div class="media-body">#}
{#                            <div class="media-heading">#}
{#                                <div class="pull-left">#}
{#                                    {% if vo.user_id is none %}#}
{#                                        <span>游客：</span>#}
{#                                    {% else %}#}
{#                                        <span>{{ vo.user_id|getUser }}：</span>#}
{#                                    {% endif %}#}
{#                                </div>#}
{#                                <div class="pull-right">#}
{#                                    <span style="float: right"><a#}
{#                                            href="{{ url_for("main.article_details",id=article.id) }}">{{ moment(vo.reply_time).fromNow(refresh=True) }}</a></span>#}
{#                                </div>#}
{#                            </div>#}
{#                            <div class="clearfix"></div>#}
{#                            <p>{{ vo.content|striptags }}</p>#}
{#                            <div class="pull-right"><a href="#">回复</a></div>#}
{#                        </div>#}
{#                    </div>#}
{#                    <hr>#}
{#                {% endfor %}#}
{#            </div>#}
        </div>
    </div>
{% endblock %}
{% block js %}
    <script type="text/javascript" src="{{ url_for('static',filename='admin/lib/layer/2.4/layer.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='admin/h-ui.admin/js/dialog.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/marked.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/prettify.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/raphael.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/underscore.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/sequence-diagram.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/flowchart.min.js') }}"></script>
    <script type="text/javascript"
            src="{{ url_for('static',filename='lib/edit.markdown/lib/jquery.flowchart.min.js') }}"></script>
    <script type="text/javascript" src="{{ url_for('static',filename='lib/edit.markdown/editormd.min.js') }}"></script>
    <script type="text/javascript">
        $("p img").addClass("img-responsive");
        $(function () {
            var Editor;
            Editor = editormd.markdownToHTML("test-editormd-view", {
                htmlDecode: "style,script,iframe",  // you can filter tags decode
                emoji: true,
                taskList: true,
                tex: true,  // 默认不解析
                flowChart: true,  // 默认不解析
                sequenceDiagram: true// 默认不解析
            })
            ;
        });

    </script>
    {% for message in get_flashed_messages(category_filter=["error"]) %}
        <script type="text/javascript">
            var msg = "{{ message }}";
            if (msg) {
                dialog.error(msg);
            }
        </script>
    {% endfor %}
    {% for message in get_flashed_messages(category_filter=["ok"]) %}
        <script type="text/javascript">
            var msg = "{{ message }}";
            if (msg) {
                dialog.success(msg);
            }
        </script>
    {% endfor %}
{% endblock %}